<script>
export default {
  name: "inlineStyle",
//   内联样式
  data(){
    return{
      style1:{'font-size':'30px'},
      style2:{'color':'red'},
      getColor(n){
        if(n == 1){
          return {'color':'red'}
        }else if(n == 2){
          return {'color':'pink'}
        }
      }
    }
  }
}
</script>

<template>
<div id="inline">
  <div style="font-size:30px">111</div>
  <div :style="{'font--size':'30px'}">222</div>
<!--  1、对象-->
  <div :style="style1">333</div>
<!--  2、数组-->
  <div :style="[style1,style2]">style</div>
<!--  3、函数返回值-->
  <div :style="getColor(n=1)">0000</div>
  <div :style="getColor(n=2)">999999</div>
</div>
</template>

<style scoped lang="less">

</style>